@use "sass:list";

$vendors  : "-webkit-", "-apple-", "-khtml-", "-moz-", "-rim-", "-xv-","-ms-", "-o-", "";

:root {
    --Nunito: 'Circe Rounded', sans-serif;
}

:root[theme="light"] {
    --mainBg   : #ffffff;
    --mainFg   : #1b364a;
    --activeFg : #2977B5;
    --actHover : #19619a;
    --fg500    : #F5F6F8;
    --fg400    : #83899F;
    --fg300    : #E8EBEF;
    --fg200    : #adb5bd;
    --fg350    : #b3d7ff;
    --hover300 : #e9f6ff;
    --check    : #29B572;
    --word     : #30599a;
    --black    : #111111;
    --bthFg    : #ffffff;
    --fg550    : #e6f1f8;
    --noticeBg : #ffffff;
    --checkNBg : #e9ecef;
    --checkNFg : #e9ecef;
    --icon     : #656d76;
    --cntWrap  : #ffffff;
    --cntHov   : #f6f8fa;
    --fg450    : rgb(34 34 34 / 60%);

    --rbg650   : rgb(0 35 63 / 95%);

    --cntTBor  : 1px solid #e9ecef;
    --cntBor   : 0;

    --boxPop   : 1px 3px 3px 0 rgb(0 0 0 / 20%), 1px 3px 15px 2px rgb(0 0 0 / 20%);
    --boxTb    : 0px 0px 50px 0px rgba(43, 40, 45, 0.15);
    --noticBox : 0 4px 20px rgba(37,40,43,.15);
    --cntBox   : 0 1px 3px rgba(31,35,40,0.12), 0 8px 24px rgba(66,74,83,0.12);
}

:root[theme="dark"] {
    --mainBg   : #22272e;
    --mainFg   : #ADBAC8;
    --activeFg : #347d39;
    --actHover : #296e2e;
    --fg500    : #1c2128;
    --fg400    : #768390;
    --fg300    : #373e47;
    --fg350    : #373e47;
    --fg200    : #444c56;
    --hover300 : #2a3037;
    --check    : #29B572;
    --word     : #30599a;
    --black    : #f1f1f1;
    --bthFg    : #ffffff;
    --fg550    : #373e47;
    --noticeBg : #101318;
    --checkNBg : #1c2128;
    --checkNFg : #373e47;
    --icon     : #768390;
    --cntWrap  : #2d333b;
    --cntHov   : #3a4049;
    --fg450    : rgba(42, 48, 55, 0.6);

    --rbg650   : rgba(99,110,123,0.4);

    --cntTBor  : 1px solid rgb(55 62 71);
    --cntBor   : 1px solid #444c56;

    --boxPop   : 1px 3px 3px 0 rgb(0 0 0 / 20%), 1px 3px 15px 2px rgb(0 0 0 / 20%);
    --boxTb    : 0 16px 32px rgba(28,33,40,0.85);
    --noticBox : 0 16px 32px rgba(28,33,40,0.85);
    --cntBox   : 0 8px 24px #1c2128;
}
